<template name="stripeSettings">
  {{#unless packageData.settings.api_key}}
  <div class="alert alert-info">
    <span data-i18n="admin.paymentSettings.stripeSettingsDescription">Don't have a Stripe API Secret Key?</span>
    <a href="https://dashboard.stripe.com/account/apikeys" target="_blank">
      <span data-i18n="admin.paymentSettings.stripeSettingsGetItHere">Get it here.</span>
    </a>
  </div>
  {{/unless}}
  <div>
    {{#autoForm collection=Collections.Packages schema=StripePackageConfig doc=packageData type="update" id="stripe-update-form"}}
      {{>afQuickField name='settings.api_key'}}
      {{>afQuickField name='settings.public.publishable_key'}}
      <button type="submit" class="btn btn-primary pull-right"><span data-i18n="app.saveChanges">Save Changes</span></button>
    {{/autoForm}}
  </div>
</template>

<template name="stripe">
  <div class="container-fluid-sm flex">
    <div class="flex-item">
      <div class="panel panel-default">
        <div class="panel-heading">
          <div class="panel-title">Stripe Checkout</div>
        </div>
        <div class="list-group">
          <div class="list-group-item">
            {{#if packageData.settings.api_key}}
              <span>API Secret Key: <button type="button" class="btn btn-link" data-event-action="showStripeSettings">**********</button></span>
            {{else}}
              <span>API Secret Key: <button type="button" class="btn btn-link" data-event-action="showStripeSettings">Configure Now</button></span>
            {{/if}}
          </div>
        </div>
        <div class="panel-footer">
          <div class="left"></div>
          <div class="right">

            <div class="panel-footer-item">
              {{#if packageData.settings.api_key}}
                <i class="fa fa-check-circle fa-2x text-success"></i>
              {{else}}
                <i class="fa fa-minus-circle fa-2x text-muted"></i>
              {{/if}}
            </div>

            <div class="panel-footer-item">
              <button class="btn btn-default" data-event-action="showStripeSettings">
                <i class="fa fa-gear"></i>
              </button>
            </div>

          </div>
        </div>
      </div>
    </div>
  </div>
</template>
